import './index.scss'
import { chooseGoods } from '../../api/shoppingMall/chooseGoods'
import { categoryTree } from '@/api/public'

export default {
  name: 'choose-goods',
  components: {
    SearchButton: ()=> import('@/components/SearchButton')
  },
  props: {
    isGetChooseData: { // 是否开始返回数据
      type: Boolean,
      default: false
    },
    clickNum: {
      type: Number,
      default: 1
    }
  },
  watch: {
    clickNum(val) {
      this.getGoodsTabel()
      console.log('val', val)
    },
    isGetChooseData() {
      if (!this.currentChooseGoods.length) {
        this.$message.error('请选择商品')
        return
      }
      this.$emit('chooseGoodsFun', {
        data: this.currentChooseGoods
      })
    }
  },
  data() {
    return {
      categoryIdArr: [],
      treeList: [],
      chooseParams: {
        channels:[1],
        goodsModuleList: [1,2],
        goodsCategoryId: '',
        name: '',
        pageNum: 1,
        pageSize: 20
      },
      list: [
        {
          id: 10,
          goodsName: '液体颊彩1',
          subTitle: '这里是商品描述',
          price: '1.00',
          // mainImage: '../../assets/commons/img_8.jpg',
          comeNum: 0,
          viewNum: 0,
          skuNum: 100,
          salesVolume: 10,
          gtmTime: '2019-08-02 15:30:30'
        },
        {
          id: 11,
          goodsName: '液体颊彩2',
          subTitle: '这里是商品描述',
          price: '4.00',
          // mainImage: '../../assets/commons/img_9.jpg',
          comeNum: 32,
          viewNum: 13,
          skuNum: 120,
          salesVolume: 10,
          gtmTime: '2019-08-02 15:36:30'
        }
      ],
      option: {
        isPagination: true,
        isMenu: false,
        height: 350,
        paginationTotal: 33,
        paginationCurrent: 1,
        paginationSize: 20,
        isSelection: true,
        highlightCurrentRow: true,
        column: [
          {
            label: '商品 价格',
            prop: 'goodsName',
            slotName: 'goodsName',
            width: '260'
          },
          {
            label: '库存',
            prop: 'stock',
            sortable: true,
            width: '100'
          },
          {
            label: '品牌',
            prop: 'brandName',
            sortable: true,
             width: '180'
          },
          {
            label: '商品类型',
            prop: 'goodsModuleName',
            sortable: true,
            width: '120'
          },
          {
            label: '创建时间',
            prop: 'createTime',
            sortable: true,
            width: '180'
          }
        ]
      },
      currentChooseGoods: []// 当前选择的
    }
  },
  created() {
    // this.getGoodsTabel()
  },
  mounted() {
    this.categoryTree()
    this.getGoodsTabel()
  },
  methods: {
    // 商品类目
    categoryTree() {
      categoryTree({}).then(res => {
        this.treeList = res
      })
    },
    changeGoodsCategory(val){
      this.chooseParams.goodsCategoryId = val[val.length - 1]
    },
    refreshParams(params) {
      this.chooseParams = params
      this.categoryIdArr = []
    },
    getList1() {
      this.chooseParams.pageNum = 1
      this.getGoodsTabel()
    },
    // 获取商品信息
    getGoodsTabel() {
      chooseGoods(this.chooseParams).then(res => {
        this.list = res.records
        this.option.paginationTotal = res.total
      })
    },
    // 选中信息
    selectionChange(ev) {
      this.currentChooseGoods = ev
    },
    // 分页
    currentChange(ev) {
      this.chooseParams.pageNum = ev.data.current
      this.chooseParams.pageSize = ev.data.size
      this.getGoodsTabel()
    }
  }
}
